﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="bootstrap.min.css" >
    <title></title>
</head>
<body>
    <div class="row">
        <div class="col-md-12" style="text-align: center;"><h1>设备注册接口示例</h1></div>
    </div>
    <form class="form-horizontal">
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">提示:</label>
            <div class="col-sm-10">
                <label for="inputEmail3" class="control-label">设备如果不是主动连接服务器都需要调用注册接口进行设备注册（适用于局域网）</label>
            </div>
        </div>
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">请求地址:</label>
            <div class="col-sm-8">
                <label for="inputEmail3" class="control-label">https://www.facedata.vip:9901/Register</label>
            </div>
        </div>
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">设备SN:</label>
            <div class="col-sm-8">
                <input type="email" class="form-control" id="inputSN" placeholder="FC-8300T21076163" >
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">设备IP:</label>
            <div class="col-sm-8">
                <input type="text" class="form-control" id="inputIP" placeholder="192.168.1.62" >
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">设备端口:</label>
            <div class="col-sm-8">
                <input type="text" class="form-control" id="inputPort" placeholder="8101" >
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" onclick="Register()" class="btn btn-default">注册</button>
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">发送参数:</label>
            <div class="col-sm-8">
                <textarea class="form-control" id="Param" style="height:200px" placeholder="发送参数"></textarea>
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">返回结果:</label>
            <div class="col-sm-8">
                <textarea class="form-control" id="Result" style="height:200px" placeholder="返回结果"></textarea>
            </div>
        </div>
    </form>
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
  <script src="jquery.min.js"></script>
</body>
</html>
<script type="text/javascript">
    function Register() {
        var sn = $("#inputSN").val();
        var ip = $("#inputIP").val();
        var port = Number($("#inputPort").val());
        if (sn.length <= 0) {
            alert("设备SN不能为空");
            return;
        }
        if (ip.length <= 0) {
            alert("设备ip不能为空");
            return;
        }
        if (isNaN(port) || port <= 0) {
            alert("设备端口号错误");
            return;
        }
        var data = {
            "sn": sn,
            "ip": ip,
            "port": port
        };
        var param = JSON.stringify(data);
        $("#Param").val(param);
        $.ajax({
            type: "POST",
            url: "/Register",
            contentType: "application/json;charset=utf-8",
            data: param,
            dataType: "json",
            success: function (message) {
              //  alert(message);
                $("#Result").val(JSON.stringify(message));
            }
        })

    }

</script>